<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>我的订单</title>
    <link rel="stylesheet" href="../bootstrap/css/bootstrap.min.css">
</head>
<body>
<div class="panel panel-default">
    <!-- Default panel contents -->
    <div class="panel-heading" style="text-align: center">我的订单</div>

    <!-- Table -->

    <table class="table">

        <tr>
            <td>订单状态</td>
            <td>订单号</td>
            <td>订单时间</td>
            <td>入住时间</td>
            <td>离店时间</td>
            <td>酒店名称</td>
            <td>房间类型</td>
            <td>房间数目</td>
            <td>房间单价</td>
            <td>支付金额</td>
            <td>快速预订</td>
        </tr>

        <tr>
            <td>已完成</td>
            <td>10086</td>
            <td>2020/6/20</td>
            <td>2020/6/24</td>
            <td>2020/6/30</td>
            <td>上海证大美爵酒店</td>
            <td>总统套房</td>
            <td>2</td>
            <td>188888</td>
            <td>388888</td>
            <td style="cursor: pointer;color: #5bc0de">点击预订酒店</td>
        </tr>

        <tr>
            <td>已完成</td>
            <td>10086</td>
            <td>2020/6/20</td>
            <td>2020/6/24</td>
            <td>2020/6/30</td>
            <td>上海证大美爵酒店</td>
            <td>总统套房</td>
            <td>2</td>
            <td>188888</td>
            <td>388888</td>
            <td>点击预订酒店</td>
        </tr>

        <tr>
            <td>已完成</td>
            <td>10086</td>
            <td>2020/6/20</td>
            <td>2020/6/24</td>
            <td>2020/6/30</td>
            <td>上海证大美爵酒店</td>
            <td>总统套房</td>
            <td>2</td>
            <td>188888</td>
            <td>388888</td>
            <td>点击预订酒店</td>
        </tr>


        <tr>
            <td>已完成</td>
            <td>10086</td>
            <td>2020/6/20</td>
            <td>2020/6/24</td>
            <td>2020/6/30</td>
            <td>上海证大美爵酒店</td>
            <td>总统套房</td>
            <td>2</td>
            <td>188888</td>
            <td>388888</td>
            <td>点击预订酒店</td>
        </tr>
    </table>
</div>
<div style="text-align: center">
    <nav aria-label="Page navigation">
        <ul class="pagination">
            <li>
                <a href="#" aria-label="Previous">
                    <span aria-hidden="true">&laquo;</span>
                </a>
            </li>
            <li><a href="#">1</a></li>
            <li><a href="#">2</a></li>
            <li><a href="#">3</a></li>
            <li><a href="#">4</a></li>
            <li><a href="#">5</a></li>
            <li>
                <a href="#" aria-label="Next">
                    <span aria-hidden="true">&raquo;</span>
                </a>
            </li>
        </ul>
    </nav>
</div>
</body>
</html>